<template>
  <div class="home">
    <home-nav></home-nav>
    <home-banner></home-banner>
    <home-channel></home-channel>
    <home-brand-list></home-brand-list>
    <home-new-goods></home-new-goods>
    <home-hot-goods></home-hot-goods>
    <home-topic-list></home-topic-list>
    <home-category-list></home-category-list>
    <nav-tabber :active="0"></nav-tabber>
  </div>
</template>

<script>
import { getHomeData } from "@/api/home/home.js";
import HomeNav from "./home-nav";
import HomeBanner from "./home-banner";
import HomeChannel from "./home-channel";
import HomeBrandList from "./home-brand-list";
import HomeNewGoods from "./home-new-goods";
import HomeHotGoods from "./home-hot-goods";
import HomeTopicList from "./home-topic-list"
import HomeCategoryList from './home-category-list'
import NavTabber from "@/components/common/nav-tabber"
export default {
  data() {
    return {};
  },
   mounted() {
    let _this = this;
    getHomeData().then((res) => _this.$store.commit("home/getHomeData", res));
  },
  components: {
    "home-nav": HomeNav,
    "home-banner": HomeBanner,
    "home-channel": HomeChannel,
    "home-brand-list": HomeBrandList,
    "home-new-goods":HomeNewGoods,
    "home-hot-goods":HomeHotGoods,
    "home-topic-list":HomeTopicList,
    "home-category-list":HomeCategoryList,
    "nav-tabber":NavTabber
  },
};
</script>

<style lang="scss" scoped>
.home{
    padding-bottom: 50px;
}
</style>